<html>
<header>
    <title></title>
    <link rel="stylesheet" href="./lib/antd/antd.min.css" />
    <style>
        [v-cloak] {
            display: none;
        }
    </style>
</header>

<body>
    <div id="app" v-cloak>
        <a-layout>
            <a-layout-header>Header</a-layout-header>
            <a-layout-content>
                <div style="margin: 30px auto;width: 1200px;">
                    <a-card title="Default size card" style="width: 1200px">
                        <a-table :data-source="dataSource" :columns="columns" :pagination="false" />
                    </a-card>
                </div>

            </a-layout-content>
            <a-layout-footer>Footer</a-layout-footer>
        </a-layout>



    </div>
    <script src="./lib/vue/vue.global.js"></script>
    <script src="https://cdn.staticfile.org/axios/0.18.0/axios.min.js"></script>
    <script src="https://momentjs.com/downloads/moment.min.js"></script>
    <script src="./lib/antd/antd.min.js"></script>
    <script>
        Vue.createApp({
            data() {
                return {
                    dataSource: [],
                    columns: [{
                        title: '车辆名称',
                        dataIndex: 'carName',
                        key: 'carName',
                    }, {
                        title: '改装分支',
                        dataIndex: 'refit',
                        key: 'refit',
                    }, {
                        title: '平跑速度',
                        dataIndex: 'base',
                        key: 'base',
                        defaultSortOrder: 'ascend',
                        sorter: (a, b) => a.base - b.base,
                    }, {
                        title: '段位双喷',
                        dataIndex: 'break',
                        key: 'break',
                    }, {
                        title: '原地转向',
                        dataIndex: 'turn',
                        key: 'turn',
                    }, {
                        title: 'CWW速度',
                        dataIndex: 'cww',
                        key: 'cww',
                    }, {
                        title: '原地转向用时',
                        dataIndex: 'turnTime',
                        key: 'turnTime',
                    }, {
                        title: '漂移一周用时',
                        dataIndex: 'drift',
                        key: 'drift',
                    }, {
                        title: '氮气动力',
                        dataIndex: 'n2',
                        key: 'n2',
                    }, {
                        title: '小喷净动力',
                        dataIndex: 'turbine',
                        key: 'turbine',
                    }, {
                        title: '集气',
                        dataIndex: 'gather',
                        key: 'gather',
                    }, {
                        title: '耐撞',
                        dataIndex: 'bump',
                        key: 'bump',
                    }, {
                        title: '小喷时间',
                        dataIndex: 'turbineTime',
                        key: 'turbineTime',
                    }, {
                        title: '氮气时间',
                        dataIndex: 'n2Time',
                        key: 'n2Time',
                    }, {
                        title: '0-180时间',
                        dataIndex: 'acceleration',
                        key: 'acceleration',
                    },],
                };
            }, created() {
                this.getACarData();
            },
            methods: {
                getACarData() {
                    var that = this;
                    axios
                        .get('./data/aCar.json')
                        .then(function (response) {
                            that.dataSource = response.data;
                            console.log(that.dataSource)
                            console.log(that.columns)
                        })
                        .catch(function (error) { // 请求失败处理
                            console.log(error);
                        });
                }
            }
        }).use(antd).mount('#app');

    </script>
</body>


<html>